<!doctype html>
        <!--[if lt IE 7]> <html class="lt-ie9 lt-ie8 lt-ie7" lang="en-US"> <![endif]-->
        <!--[if IE 7]>    <html class="lt-ie9 lt-ie8" lang="en-US"> <![endif]-->
        <!--[if IE 8]>    <html class="lt-ie9" lang="en-US"> <![endif]-->
        <!--[if gt IE 8]><!--> <html lang="en-US"> <!--<![endif]-->
        <head>
                <!-- META TAGS -->
                <meta charset="UTF-8" />
                <meta name="viewport" content="width=device-width, initial-scale=1.0">

                <title>Knowledge Base Theme</title>

                
                <!-- Style Sheet-->
                <link rel="stylesheet" href="style.css"/>
                <link rel='stylesheet' id='bootstrap-css-css'  href='css/bootstrap5152.css?ver=1.0' type='text/css' media='all' />
                <link rel='stylesheet' id='responsive-css-css'  href='css/responsive5152.css?ver=1.0' type='text/css' media='all' />
                <link rel='stylesheet' id='pretty-photo-css-css'  href='js/prettyphoto/prettyPhotoaeb9.css?ver=3.1.4' type='text/css' media='all' />
                <link rel='stylesheet' id='main-css-css'  href='css/main5152.css?ver=1.0' type='text/css' media='all' />
                <link rel='stylesheet' id='custom-css-css'  href='css/custom5152.html?ver=1.0' type='text/css' media='all' />
				<link rel='stylesheet' href="css/no-show.css" />

                <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
                <!--[if lt IE 9]>

                <![endif]-->


        </head>

        <body>
      <div id="kuan" v-cloak>

          <div class="header-wrapper">

                  <div class="container">


                      <div >
                          <!-- Website Logo -->
                          <a href="main.html"   >
                              <img src="images/taru.jpg"
                                   style="height:60px;">
                          </a>
                          <span class="tag-line">塔里木大学</span>
                      </div>


                      <!-- Start of Main Navigation -->
                      <nav class="main-nav">
                          <div class="menu-top-menu-container">
                              <ul id="menu-top-menu" class="clearfix">
                                  <li class="current-menu-item"><a href="main.html">Home</a></li>
                                  <li><a href="#">科普模块</a>
                                      <ul class="sub-menu">
                                          <li><a @click="pes"  href="disease-list.html">虫害科普</a></li>
                                          <li><a @click="pesCon" href="disease-list.html">虫害防治</a></li>
                                          <li><a @click="dis" href="disease-list.html">病害科普</a></li>
                                          <li><a @click="disCon" href="disease-list.html">病害防治</a></li>
                                      </ul></li>
                                  <li><a href="exchange-list.html">讨论模块</a></li>
                                  <li><a href="forecast.html">数据预测</a></li>
                                  <li><a href="#">用户信息</a>
                                      <ul class="sub-menu">
                                          <li><a href="selectUser.html">查看用户信息</a></li>
                                          <li><a href="updateUser.html">修改用户信息</a></li>
                                          <li><a href="updateUserPassword.html">修改用户密码</a></li>
                                      </ul>
                                  </li>
                                  <li v-if="flag"><a href="#">管理员模块</a>
                                      <ul class="sub-menu">
                                          <li><a href="disease-list-statue.html">文章审核</a></li>

                                      </ul>
                                  </li>

                              </ul>
                          </div>
                      </nav>
                      <!-- End of Main Navigation -->

                  </div>

          </div>
             
                <!-- Start of Page Container -->
                <div class="page-container">
                        <div class="container">
                                <div class="row">
									 
                                        <!-- start of page content -->
                                        <div class="span8 main-listing">
											<div v-for="lists in list">
                                                <div class="format-standard type-post hentry clearfix">
                                                        <header class="clearfix">
                                                                <h3  class="post-title" >
																	<a @click="selectOne" :id="lists.exchangeId" href="exchange-detail.html">{{lists.exchangeTitle}}</a>
                                                                </h3>
                                                                  <div class="post-meta clearfix">
                                                                <span class="date">{{lists.updateDate}}</span>
                                                                    <span class="comments"><a href="#" title="Comment on Using Javascript">{{lists.commentList.length}} 评论</a></span>
                                                                      
                                                                       </div>
                                                        </header>
                                                </div>
                                      		</div>









                                            <div class="page-bar">

                                                <ul>
                                                    <li v-if="showFirst"><a v-on:click="cur--,back()">上一页</a></li>
                                                    <li v-for="index in indexs"  v-bind:class="{ 'active': cur == index}">
                                                        <a v-on:click="btnClick(index)">{{ index }}</a>
                                                    </li>
                                                    <li v-if="showLast"><a v-on:click="cur++,next()" >下一页</a></li>
                                                    <li><a>共<i>{{all}}</i>页</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                        <!-- end of page content -->


                                        <!-- start of sidebar -->
                                        <aside class="span4 page-sidebar">

                                               <section class="widget">
                                                        <div class="support-widget">
                                                            <h3  class="title"><span v-model="userNickname" ><input style="border:none; background-color:transparent;"  readonly="readonly" v-model="userNickname"></span></h3>
                                                                <p class="intro"><div  v-model="userNickname" > 亲爱的用户欢迎您</div></p>
                                                        </div>
                                                </section>


                                               <section class="widget">
                                                        <h3 class="title">往期文章</h3>
                                                        <ul class="articles">
                                                                <li class="article-entry standard">
                                                                        <h4><a href="single.html">枣树病虫害防治技术要点</a></h4>
                                                                </li>
                                                                <li class="article-entry standard">
                                                                        <h4><a href="single.html">枣树病虫害防治：枣树的常见病虫害及防治方法简介</a></h4>
                                                                </li>
                                                                <li class="article-entry video">
                                                                        <h4><a href="single.html">粘虫板在枣树虫害防治中的应用研究</a></h4>
                                                                </li>

                                                        </ul>
                                                </section>



                                               

                                        </aside>
                                        <!-- end of sidebar -->
                                </div>
                        </div>
                </div>
                <!-- End of Page Container -->

              

                <!-- End of Footer -->

                <a href="#top" id="scroll-top"></a>

                <!-- script -->
    </div>
                <script type='text/javascript' src='js/jquery-1.8.3.min.js'></script>
                <script type='text/javascript' src='js/jquery.easing.1.34e44.js?ver=1.3'></script>
                <script type='text/javascript' src='js/prettyphoto/jquery.prettyPhotoaeb9.js?ver=3.1.4'></script>
                <script type='text/javascript' src='js/jquery.liveSearchd5f7.js?ver=2.0'></script>
				<script type='text/javascript' src='js/jflickrfeed.js'></script>
                <script type='text/javascript' src='js/jquery.formd471.js?ver=3.18'></script>
                <script type='text/javascript' src='js/jquery.validate.minfc6b.js?ver=1.10.0'></script>
                <script type='text/javascript' src='js/custom5152.js?ver=1.0'></script>
				<script type="text/javascript" src="js/url.js"></script>
				<script type="text/javascript" src="js/vue(1).js"></script>
				<script type="text/javascript" src="js/axios.min.js"></script>
      <script>
          var vue = new Vue({

              el: '#kuan', //挂载点
              data: {
                  list: [],
                  commentLenght:'',
                  flag:false,
                  userNickname:'',
                  all: '', //总页数
                  cur: 1,//当前页码
              },
              created: function() {
                  this.selectLen();
                  this.init();
                  this.userOrAdmin();

              },
              methods: {
                  btnClick: function(data){//页码点击事件
                      var self = this;
                      console.log("当前页码"+data)
                      if(data != self.cur){
                          self.cur = data
                          var param=new URLSearchParams();
                          param.append('pageNum',self.cur);
                          param.append('pageSize',5);
                          axios
                              .post(web_server+"query/exchange",param)
                              .then(function(response) {
                                  //var object =JSON.stringify(response)
                                  var objects= response.data;
                                  if(objects.status == 200) {
                                      var object = objects.data
                                      self.list = "";
                                      self.list= object;
                                      window.location.href="#"
                                      //self.list.size=self.commentLenght;
                                      //console.log(self.list[0].commentList)
                                  }

                              })
                              .catch(function(error) {
                                  console.log(error)
                              });
                      }
                  },
                  next: function(){
                      var self = this;
                      var param=new URLSearchParams();
                      param.append('pageNum',self.cur);
                      param.append('pageSize',5);
                      axios
                          .post(web_server+"query/exchange",param)
                          .then(function(response) {
                              //var object =JSON.stringify(response)
                              var objects= response.data;
                              if(objects.status == 200) {
                                  var object = objects.data
                                  self.list = "";
                                  self.list= object;
                                  console.log(object)
                                  window.location.href="#"
                                  //self.list.size=self.commentLenght;
                                  //console.log(self.list[0].commentList)
                              }

                          })
                          .catch(function(error) {
                              console.log(error)
                          });
                  },
                  back:function(){
                      var self = this;
                      var param=new URLSearchParams();
                      param.append('pageNum',self.cur);
                      param.append('pageSize',5);
                      axios
                          .post(web_server+"query/exchange",param)
                          .then(function(response) {
                              //var object =JSON.stringify(response)
                              var objects= response.data;
                              if(objects.status == 200) {
                                  var object = objects.data
                                  self.list = "";
                                  self.list= object;
                                  console.log(object)
                                  window.location.href="#"
                                  //self.list.size=self.commentLenght;
                                  //console.log(self.list[0].commentList)
                              }

                          })
                          .catch(function(error) {
                              console.log(error)
                          });
                  },
                  userOrAdmin: function(){
                      var userSort = window.sessionStorage.getItem("userSort");
                      if(userSort == 2 ){
                          self.flag = true;
                      }
                  },
                  init: function() {
                      var self = this;
                      var param=new URLSearchParams();
                      self.userNickname = window.sessionStorage.getItem("userNickname");
                      param.append('pageNum',self.cur);
                      param.append('pageSize',5);
                      axios
                          .post(web_server+"query/exchange",param)
                          .then(function(response) {
                              //var object =JSON.stringify(response)
                              var objects= response.data;
                              if(objects.status == 200) {
                                  var object = objects.data
                                  self.list= object;
                                  console.log(self.list)
                                  //this.moun;
                                  //self.list.size=self.commentLenght;
                                  //console.log(self.list[0].commentList)
                              }

                          })
                          .catch(function(error) {
                              console.log(error)

                          });
                  },
                  selectLen: function() {
                      var self = this;
                      var param=new URLSearchParams();
                      self.userNickname = window.sessionStorage.getItem("userNickname");
                      axios
                          .post(web_server+"query/exchange/len",param)
                          .then(function(response) {
                              var objects= response.data;
                              if(objects.status == 200) {
                                  var object = objects.data
                                  var length = object.length/5;
                                  var len = Math.ceil(length)
                                  self.all= len;
                              }

                          })
                          .catch(function(error) {
                              console.log(error)
                          });
                  },
                  selectOne: function(e){
                      var self = this;
                      window.sessionStorage.setItem("articleId", e.target.id);
                  },
                  pes:function(){
                      window.sessionStorage.setItem("sort", "1");
                  },
                  pesCon:function(){
                      window.sessionStorage.setItem("sort", "2");
                  },
                  dis:function(){
                      window.sessionStorage.setItem("sort", "3");
                  },
                  disCon:function(){
                      window.sessionStorage.setItem("sort", "4");
                  }

              },
              computed: {
                  showLast: function(){
                      if(this.cur == this.all){
                          return false
                      }
                      return true
                  },
                  showFirst: function(){
                      if(this.cur == 1){
                          return false
                      }
                      return true
                  },
                  indexs: function(){
                      var left = 1
                      var right = this.all
                      var ar = []
                      if(this.all>= 11){
                          if(this.cur > 5 && this.cur < this.all-4){//大于6并且小于16
                              left = this.cur - 5
                              right = this.cur + 4
                          }else{
                              if(this.cur<=5){
                                  left = 1
                                  right = 10
                              }else{
                                  right = this.all
                                  left = this.all -9
                              }
                          }
                      }
                      while (left <= right){
                          ar.push(left)
                          left ++
                      }
                      return ar
                  }

              }
          })

      </script>


        </body>
</html>
